<template>
  <main class="wss-container">
    <div class="tab-box">
      <ComTabs
        @EventSelectTab="currentSelect"
        :activeName="activeName"
        :tabList="tabList"
      ></ComTabs>
    </div>
    <div class="main-box">
      <div class="category" v-if="activeName == 'pricechange'">
        <Pricechange></Pricechange>
        <!-- 1 -->
      </div>
      <div class="materials" v-if="activeName == 'bobisetting'">
        <Bobisetting></Bobisetting>
      </div>
      <div class="userassignment" v-if="activeName == 'userassignment'">
        <Userassignment></Userassignment>
      </div>
      <div class="invoice" v-if="activeName == 'invoice'">
        <Invoice></Invoice>
      </div>
      <div class="recharge" v-if="activeName == 'recharge'">
        <Recharge></Recharge>
      </div>
      <div class="materials" v-if="activeName == 'withdraw'">
        <Withdraw></Withdraw>
      </div>
      <div class="materials" v-if="activeName == 'budgetFohf'">
        <BudgetFohf></BudgetFohf>
      </div>
    </div>
  </main>
</template>

<script>
// import Category from "./category";
// import Materials from "./materials";
import Invoice from "@/wss/newViews/BK/aricereview/invoice.vue";
import Pricechange from "./pricechange.vue";
import Bobisetting from "./bobisetting.vue";
import Userassignment from "./userassignment.vue";
import BudgetFohf from "./budgetFohf.vue";

import Withdraw from "@/wss/newViews/BK/aricereview/withdraw.vue";
import Recharge from "@/wss/newViews/BK/aricereview/recharge.vue";

import ComTabs from "@/wss/components/ComTabs.vue";
export default {
  components: {
    ComTabs,
    Pricechange,
    Bobisetting,
    Invoice,
    Recharge,
    Withdraw,
    Userassignment,
    BudgetFohf
  },
  data() {
    return {
      activeName: "pricechange",
      // tab页数据
      tabList: [
        {
          label: "分成改价",
          name: "pricechange",
        },
        {
          label: "拨比设置",
          name: "bobisetting",
        },
        {
          label: "问金赋值",
          name: "userassignment",
        },
        {
          label: "发票设置",
          name: "invoice",
        },

        {
          label: "提现设置",
          name: "withdraw",
        },
        {
          label: "充值设置",
          name: "recharge",
        },
        {
          label: "专户",
          name: "budgetFohf",
        },
      ],
    };
  },
  methods: {
    currentSelect({ label, index, name }) {
      // console.log(name, "搞定了搞定了");
      this.activeName = name;
    },
  },
  
};
</script>

<style scoped>
.wss-container {
  display: flex;
  flex-direction: column;
}
.wss-container .tab-box {
  height: 40px;
  margin-bottom: 20px;
}
.wss-container .main-box {
  height: calc(100% - 60px);
}
.wss-container .category,
.wss-container .materials,
.wss-container .standard {
  height: 100%;
}
.invoice,
.invoice >>> .el-row{
  height: 100%;
}

.recharge,
.recharge >>> .el-row{
  height: 100%;
}
.userassignment,
.userassignment >>> .el-row{
  height: 100%;
}
</style>